<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>基本设置</title>
<link rel="stylesheet" href="/js/plugin/layui-v2.3.0/layui/css/layui.css">
<link rel="stylesheet" href="/css/reset.css">
<link rel="stylesheet" href="/css/index.css">
<link rel="stylesheet" href="/css/project_set.css">
<script src="/js/jquery-2.1.1.min.js"></script>
<script src="/js/plugin/layui-v2.3.0/layui/layui.js"></script>
<script src="/js/common.js"></script>
</head>
<style>
body, html {
	height: auto;
	color:#333;
}

.my-line .layui-inline {
	vertical-align: top
}
.nav-section-header-title{color:#666;}
.layui-form-item label{color:#999;}
.layui-input-inline{padding: 9px 0; }
.title{font-size: 20px;font-weight: 300;}
</style>
<body>

	<div class="nav-section-content-container" style="padding: 0px">
		<header class="nav-header">
			<div class="nav-section-header-title">
				<span>合同信息</span>
				<div class="f-right">
					<button class="layui-btn layui-btn-radius layui-btn-normal" id="toAddreNew">合同续签</button>
					<th:block th:if="${contract.state} == 0">
						<button class="layui-btn layui-btn-radius layui-btn-danger" id="toEndContract">合同终止</button>
					</th:block>
				</div>
			</div>
		</header>
		<div class="kb-form-container">

			<fieldset class="fieldset">

				<input type="hidden" id="id" name="id" th:value="${contract.id}" />
				<input type="hidden" id="fkProject" name="fkProject" th:value="${contract.fkProject}" />
				<input type="hidden" id="fkTeam" name="fkTeam" th:value="${contract.fkTeam}" />
				<div>
					<div class="layui-form-item">
						<div class="layui-inline">
							<label class="layui-form-label">合同编号</label>
							<div class="layui-input-inline" style="width: 150px;">
								<span th:text="${contract.contractNumber}"></span>
							</div>
						</div>
						<div class="layui-inline">
							<label class="layui-form-label text-r">合同时长</label>
							<div class="layui-input-inline" style="width: 250px;">
								<span th:text="${#dates.format(contract.startDate,'yyyy年MM月dd日')}+'-'+${#dates.format(contract.endDate,'yyyy年MM月dd日')}"></span>
							</div>
						</div>
					</div>
					<div class="layui-form-item">
						<div class="layui-inline">
							<label class="layui-form-label">公司名称</label>
							<div class="layui-input-inline" style="width: 150px;">
								<span th:text="${team.fullName}"></span>
							</div>
						</div>
					</div>
					<div class="layui-form-item">
						<div class="layui-inline">
							<label class="layui-form-label">封闭工位</label>
							<div class="layui-input-inline" style="width: 150px;">
								<span id="fbName"></span>
							</div>
						</div>

						<div class="layui-inline">
							<label class="layui-form-label text-r">开放工位</label>
							<div class="layui-input-inline" style="width: 150px;">
								<span id="kfName"></span>
							</div>
						</div>
					</div>
					<div class="layui-form-item">
					<div class="layui-inline">
						<label class="layui-form-label">合同租金</label>
						<div class="layui-input-inline" style="width: 150px;">
							<span class="ysSum"></span>
						</div>
						</div>
						<div class="layui-inline">
						<label class="layui-form-label text-r">合同押金</label>
						<div class="layui-input-inline" style="width: 150px;">
							<span th:text="'￥'+${contract.deposit}"></span>
							<input id="yj" hidden="hidden" th:value="${contract.deposit}">
						</div>
						</div>
					</div>
					<div class="layui-form-item">
						<div class="layui-inline">
							<label class="layui-form-label">合同总额</label>
							<div class="layui-input-inline" style="width: 182px;">
								<span class="contractSum"></span>
							</div>
						</div>

					</div>

				</div>
			</fieldset>
			<fieldset class="fieldset">
				<legend>公司信息</legend>
				<div>
					<div class="layui-form-item">
						<label class="layui-form-label">公司全称</label>
						<div class="layui-input-inline">
							<span th:text="${team.fullName}"></span>
						</div>
						<label class="layui-form-label">公司简称</label>
						<div class="layui-input-inline">
							<span th:text="${team.simpleName}"></span>
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">负责人</label>
						<div class="layui-input-inline">
							<span th:text="${team.chargeName}"></span>
						</div>
						<label class="layui-form-label">联系电话</label>
						<div class="layui-input-inline">
							<span th:text="${team.chargePhone==''?'暂无':team.chargePhone}"></span>
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">邮箱</label>
						<div class="layui-input-inline">
							<span th:text="${team.chargeMail==''?'暂无':team.chargeMail}"></span>
						</div>
					</div>

				</div>
			</fieldset>
			<fieldset class="fieldset">
				<legend>合同信息</legend>
				<div>
					<div class="layui-form-item">
						<label class="layui-form-label">合同类型：</label>
						<div class="layui-input-inline">
							<th:block th:if="${contract.state} == 0">
								<span>在签</span>
							</th:block>
							<th:block th:if="${contract.state} == 1">
								<span>即将到期</span>
							</th:block>
							<th:block th:if="${contract.state} == 2">
								<span>已退租</span>
							</th:block>
						</div>

					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">合同编号：</label>
						<div class="layui-input-inline">
							<span th:text="${contract.contractNumber}"></span>
						</div>

					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">合同扫描件</label>
						<div class="layui-input-inline">
						<div class="layui-upload">
						   
						    <div id="testName2">
						    	<span th:id="${sys.id}" th:each="sys,sysStat : ${sysAttachments}"><a target="_blank" th:href="|${sys.filePath}${sys.id}${sys.fileType}|" th:text="|${sysStat.count}.${sys.fileName}|"></a>&nbsp;<input type="hidden" id="fileId" name="fileId" th:value="${sys.id}" /></span>
						    </div> 
						</div>
						</div>
					</div>

				</div>
			</fieldset>
			<fieldset class="fieldset">
				<legend>合同日期</legend>
				<div>
					<div class="layui-form-item">
						<label class="layui-form-label" style="width:100px">签约日期</label>
						<div class="layui-input-inline">
							<span th:text="${#dates.format(contract.signTime,'yyyy-MM-dd')}"></span>
						</div>
						<label class="layui-form-label" style="width:100px">起始日期</label>
						<div class="layui-input-inline">
							<span th:text="${#dates.format(contract.startDate,'yyyy-MM-dd')}"></span>
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label" style="width:100px">合同终止日期</label>
						<div class="layui-input-inline">
							<span th:text="${#dates.format(contract.endDate,'yyyy-MM-dd')}"></span>
						</div>
						<label class="layui-form-label" style="width:100px">实际终止日期</label>
						<div class="layui-input-inline">
							<span th:text="${#dates.format(contract.realEndDate,'yyyy-MM-dd')}"></span>
						</div>
					</div>
				</div>
			</fieldset>
			<fieldset class="fieldset">
				<legend>工位设置</legend>
				<div id="fengbiList" style="display:none">
					<h2 class="title">封闭工位</h2>
					<table class="layui-table" >
					<thead><tr><th>位置</th><th>单价</th><th>工位数</th><th>总租金</th></tr></thead>
					<tbody></tbody>
					</table>
				</div>
				<div id="kaifangList" style="display:none">
				<h2 class="">开发工位</h2>
					<table class="layui-table" >
					<thead><tr><th>位置</th><th>单价</th><th>工位数</th><th>工位号</th><th>总租金</th></tr></thead>
					<tbody></tbody>
					</table>
				</div>
			</fieldset>
			<fieldset class="fieldset">
				<legend>押金信息</legend>
				<div><table class="layui-table" id="yjList">
					<thead><tr><th>时长</th><th>付款日期</th><th>押金总金额</th><th>账单编号</th></tr></thead>
					<tbody></tbody>
					</table></div>
			</fieldset>
			<fieldset class="fieldset">
				<legend>缴租阶段</legend>
				<div>
				<table class="layui-table" id="receiveList">
					<thead><tr><th>时段</th><th>缴租日</th><th>金额</th><th>账单编号</th></tr></thead>
					<tbody></tbody>
				</table>
				<span style="padding-bottom: 6px;margin-bottom: 20px;border-bottom: 1px solid #e6e6e6;float:right">总额：<strong class="ysSum" style="font-size: 20px;font-weight: 300;"></strong></span>
				</div>
			</fieldset>
			<th:block th:if="${contract.renewid}">
				<fieldset class="fieldset">
					<legend>原合同</legend>
					<div th:text="${contract.renewid}"></div>
				</fieldset>
			</th:block>
			<fieldset class="fieldset">
				<legend>合同备注</legend>
				<div th:text="${contract.remark ==''?'暂无数据':contract.remark}"></div>
			</fieldset>

		</div>
	</div>
</body>
<script th:inline="javascript" >
	$(function() {
		 getGwList();
		 getReceiveList();
		layui.config({base : '/js/plugin/layui-v2.3.0/layui/' //此处路径请自行处理, 可以使用绝对路径
			}).extend({formSelects : 'formSelects-v3'
			}).use([ 'element', "layer", "form", 'formSelects', 'table' ],function() {
				var layer = layui.layer, form = layui.form, formSelects = layui.formSelects, table = layui.table;
				
			});
		setHeight();
		$("#toAddreNew").on("click",function(){
			var fkProject=$("#fkProject").val();
			var fkTeam  = $("#fkTeam").val();
			var id = $("#id").val();
			var iframeSrc='/app/contractInfo/toAddReNewContract/'+fkProject+'_'+fkTeam+'_'+id;
			var iframe = window.parent.parent.document.getElementById('iframe-top');//动态创建iframe，禁止iframe的src回退；
			if(!iframe){
				iframe = window.parent.parent.document.getElementById('project-iframe');
			}
		    iframe.src = iframeSrc;
		})
		$("#toEndContract").on("click",function(){
			var id = $("#id").val();
			parent.layer.open({
				type: 2, 
				title:"终止合同",
				area: ['700px','90%'],
				   shade: [0.6, '#000'],
				   zIndex:800,
				content:"/app/contractInfo/toEndContract/"+id , 
				end: function () {
					location.reload();
				}
			});
		})
	})

	function setHeight() {
		var h = document.body.clientHeight*1;
		window.parent.setiframeWrap(h);
	}
	//获取应收列表
	function getReceiveList(){
		var contractId = $("#id").val();
		var url="/app/contractReceivable/listdata";
		jQuery.ajax({
	        type:"post",
	        async:false,
	        url:url,
	        dataType:"json",
	        data:{'params[contractId]':contractId},
	        success:function(data){
	        	initReceiveList(data.data);
	        }
	    })
	}
	function initReceiveList(data){
		var str = "";
		var sum = 0;
		var yj = "";
		for(var i =0;i<data.length;i++){
			if(data[i].fkDicReceivableType == 0){
				str +="<tr><td>"+data[i].startDate +' ~ ' +data[i].endDate+"</td><td> "+data[i].receivableDate+"</td><td>￥ "+data[i].receivableAmount+" </td>";
				if(!data[i].receivableNumber && data[i].state == 0){
					str +="<td>未生成</td></tr>";
				}else{
					str +="<td>"+data[i].receivableNumber+"</td></tr>";
				}
				sum += data[i].receivableAmount;
			}else if(data[i].fkDicReceivableType == 1){
				yj +="<tr><td>"+[[${contract.depositMonth}]]+"个月</td><td> "+data[i].receivableDate+"</td><td>￥ "+data[i].receivableAmount+"</td>";
				if(!data[i].receivableNumber && data[i].state == 0){
					yj +="<td>未生成</td></tr>";
				}else{
					yj +="<td>"+data[i].receivableNumber+"</td></tr>";
				}
				sum += data[i].receivableAmount;
			}
			
		}
		if(str !=""){
			$("#receiveList").find("tbody").html(str);
		}
		if(yj !=""){
			$("#yjList").find("tbody").html(yj);
		}
		$(".ysSum").text("￥ "+sum);
    	$(".contractSum").text("￥ "+sum);
	}
	//获取工位信息
	function getGwList(){
		var contractId = $("#id").val();
		var url="/app/contractPartition/listdata";
		jQuery.ajax({
	        type:"post",
	        async:false,
	        url:url,
	        dataType:"json",
	        data:{'params[contractId]':contractId},
	        success:function(data){
	        	initGWlist(data.data);
	        }
	    })
	}
	function initGWlist(data){
		var fb = "";
		var kf = "";
		var fbName = "";
		var kfName = "";
		for(var i =0;i<data.length;i++){
			if(data[i].partition.partitionType == 2){
				fb +="<tr><td>"+data[i].partition.partitionName+"</td><td>￥ "+data[i].roomPrice+"</td><td>"+data[i].stationNumber+" 个</td><td>￥ "+data[i].totalRent+"/月</td></tr>";
				fbName += data[i].partition.partitionName+"( "+data[i].stationNumber+" ),";
			}else{
				kf +="<tr><td>"+data[i].partition.partitionName+"</td><td>￥ "+data[i].stationPrice+"</td><td>"+data[i].stationNumber+" 个</td><td>"+data[i].gongweiName+"</td><td>￥ "+data[i].totalRent+"/月</td></tr>";
				kfName += data[i].partition.partitionName+"( "+data[i].stationNumber+" ),";
			}
		}
		if(kf !=""){
			$("#kaifangList").css("display","block").find("tbody").html(kf);
		}
		if(fb != ""){
			$("#fengbiList").css("display","block").find("tbody").html(fb);
		}
		if(kfName ==""){
			$("#kfName").text("暂无");
		}else{
			$("#kfName").text(kfName);
		}
		if(fbName ==""){
			$("#fbName").text("暂无");
		}else{
			$("#fbName").text(fbName);
		}
	}
</script>
</html>